<!DOCTYPE html>
<html>
  <head>
    <title>布尔操作可视化</title>
  </head>
  <body>
    <input id="text" type="text">
    <span id="error"></span>
    <canvas id="canvas" width="1000" height="500"></canvas>

    <script src="../utils.js"></script>
    <script src="index.js"></script>
    <script>
      window.onload = () => {
        const canvas = document.getElementById('canvas');
        const ctx = canvas.getContext('2d');
        document.querySelector('#text').addEventListener('input', debounce(function(event) {
          draw(event.target.value, ctx);
        }, 1000));
      }
    </script>
  </body>
</html>
